<template>
<div class='section'>
 
  <div class="header">
       <!-- 就像java里面判断空指针和集合不是空一样，这个地方也最好加上 v-if --> 
       <label v-if="goodList[0]">{{goodList[0].goods_tag}}</label>
       <router-link v-if="goodList[0]" :to="'/more/' + goodList[0].goods_tag">
            <label class="more">查看更多></label>
       </router-link>
  </div>
  
  <div class="list">
    <Good v-for="(good, index) in goodList" 
            :key="index" 
            :good="good"/>
  </div>
 
</div>
</template>

<script>
import Good from "./Good.vue"

export default {
   props:{
       goodList:{
           type: Array
       }
   },
   components: {
       Good,
   },
   setup(props, context) {
      return {

      };
   },
}
</script>
<style  scoped>
.list {
  display: flex;
  overflow-x: scroll;
  width: 100%;
  height: 350px;
}

.header{
  display: flex;
  justify-content: space-between;
}
.more {
    font-size: 0.1rem;
    padding-right: 15px;
}
</style>